<template>
    <div class="errPage-container">

        <el-row>
            <el-col :span="12">
                <h5 class="text-jumbo text-ginormous">
                    欢迎光临~!
                </h5>
                <ul class="list-unstyled">
                    <li>你想干嘛呢:</li>
                    <li class="link-type">
                        <a href="#" @click="check">查看状态</a>
                    </li>
                    <li v-if="loginType === true"><a href="#" @click.prSevent="tanchu">点击审核</a></li>
                </ul>
            </el-col>
            <el-col :span="12">
                <img :src="errGif" width="600" height="428" alt="Girl has dropped her ice cream.">
            </el-col>
        </el-row>

        <!--查看状态-->
        <el-dialog :visible.sync="dialogVisibleCheck" title="检查">
            <template>
                <el-table :data="tableDataCheck" stripe style="width: 100%">
                    <el-table-column prop="name" label="店铺名字">
                    </el-table-column>
                    <el-table-column prop="address" label="是否启用">
                    </el-table-column>
                </el-table>
            </template>
        </el-dialog>

        <!--通过窗口-->
        <el-dialog :visible.sync="dialogVisible" title="随便看">
            <template>
                <el-table :data="tableData" stripe style="width: 100%">
                    <el-table-column prop="name" label="公司名字">
                    </el-table-column>
                    <el-table-column prop="address" label="公司地址">
                    </el-table-column>
                    <el-table-column label="操作">
                        <template slot-scope="scope">
                            <el-button
                                    size="mini"
                                    @click="handleEdit(scope.$index, scope.row)">通过</el-button>
                            <el-button
                                    size="mini"
                                    type="danger"
                                    @click="handleRejected(scope.$index, scope.row)">驳回</el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </template>
        </el-dialog>

        <!--驳回-->
        <el-dialog title="驳回原因" :visible.sync="dialogFormVisible">
            <el-form :model="form">
                <el-form-item label="公司名称：">
                    {{form.gsname}}
                </el-form-item>
                <template>
                <el-form-item label="驳回原因：">
                <el-select v-model="form.id" clearable placeholder="请选择">
                    <el-option
                            v-for="item in options"
                            :key="item.id"
                            :label="item.name"
                            :value="item.id">
                    </el-option>
                </el-select>
                </el-form-item>
            </template>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">取 消</el-button>
                <el-button type="primary" @click="sendReject">确 定</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
    import errGif from '../../assets/401_images/401.gif'



    export default {
        name: 'Page401',
        data() {
            return {
                tableDataCheck:[],
                tableData:[],
                errGif: errGif + '?' + +new Date(),
                ewizardClap: 'https://wpimg.wallstcn.com/007ef517-bafd-4066-aae4-6883632d9646',
                dialogVisible: false,
                dialogVisibleCheck:false,
                dialogFormVisible:false,
                loginType:'',
                form:{
                    id:'',
                    gsname:'',
                    shopid:''
                },
                options:[],

            }
        },
        methods: {
            //驳回确定
            sendReject(){
                // this.dialogFormVisible = false
                console.debug(this.form)
                this.$http.post("/rejected/sendReject",this.form).then(res=>{

                })
            },
            //驳回按钮
            handleRejected(index,row){
                console.debug(index,row)
                this.dialogFormVisible = true;
                this.$http.post("/rejected/shop",{"id":row.id}).then(res=>{
                    console.debug(res);
                     this.form.gsname = res.data.name;
                    this.form.shopid = res.data.id;
                })
            },
            //驳回列表查询
            findRejected(){
                this.$http.post("/rejected").then(res=>{
                    console.debug(res);
                    this.options = res.data;
                })
            },
            //查看状态窗口
            check(){
                this.dialogVisibleCheck = true;
            },
            //审核通过窗口
            handleEdit(index,row){
                // console.debug(row);
                let id = {"id":row.id}
                //通过应该把其数据的状态改成1成为待激活状态
                this.$http.put("/audit",id).then((res)=>{
                    console.debug(res);
                    let{message,success} = res.data;
                    //console.debug(success);
                    if(success){
                        this.$message({
                            message: '通过成功',
                            type: 'success'
                        });
                        this.findState();
                    }else{
                        this.$message({
                            message: message,
                        });
                        this.findState();
                    }
                })
            },
            //审核弹出窗口发送的查询请求
            findState(){
                this.$http.post("/audit").then(res=>{
                    this.tableData = res.data;
                })
            },
            //审核弹出窗口
            tanchu(){
                this.dialogVisible=true;
                this.findState();
                this.findRejected();
            },
            back() {
                if (this.$route.query.noGoBack) {
                    this.$router.push({
                        path: '/dashboard'
                    })
                } else {
                    this.$router.go(-1)
                }
            }
        },mounted(){
            var str = localStorage.getItem("userLogin");
            var user = JSON.parse(str);
            console.debug(user);
            this.$http.post("/mylogin",{"id":user.id}).then(res=>{
                console.debug(res);
                this.loginType = res.data.success;
            })
        }
    }
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
    .errPage-container {
        width: 800px;
        max-width: 100%;
        margin: 100px auto;

        .pan-back-btn {
            background: #008489;
            color: #fff;
            border: none !important;
        }

        .pan-gif {
            margin: 0 auto;
            display: block;
        }

        .pan-img {
            display: block;
            margin: 0 auto;
            width: 100%;
        }

        .text-jumbo {
            font-size: 60px;
            font-weight: 700;
            color: #484848;
        }

        .list-unstyled {
            font-size: 14px;

            li {
                padding-bottom: 5px;
            }

            a {
                color: #008489;
                text-decoration: none;

                &:hover {
                    text-decoration: underline;
                }
            }
        }
    }
</style>
